<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText" @tap="onreturn()">返回</block>
			<block slot="content">用户管理</block>
		</cu-custom>

		<view class="container">
			<view class="address-list">
				<view class="a-address" v-for="(item,index) in userlist" :key="index">
					<view class="left-text" :class="item.isDefault? 'active':''" @tap="selectTap(item.id)">
						<view class="name-tel">
							{{item.name}} {{item.phone}}
						</view>
						<view class="address-box">
							{{item.zhiwu}}
						</view>
					</view>
					<view class="right-edit cuIcon-edit" @tap="editAddess(item.id)"></view>
					<view class="right-del cuIcon-delete" @tap="del(item.id)" :data-index="index"></view>
				</view>
			</view>
			<view class="bottom-box">
				<view class="add-btn" @tap="addAddess">新建用户</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userlist: [],
			}
		},
		onBackPress(options) {

			// Android 实体返回键 (from = backbutton)
			// 顶部导航栏左边的返回按钮 (from = backbutton)
			// 返回 API，即 uni.navigateBack() (from = navigateBack)

			if (options.from === 'navigateBack') {
				return false;
			}
			this.backButton();
			return true;

		},
		onLoad() {
			//this.getuserlist();
		},
		onShow() {
			this.getuserlist();
		},
		methods: {

			// 返回上一页
			onreturn() {
				uni.reLaunch({
					url: '../index/index'
				});
			},
			backButton() {
				uni.navigateBack({
					delta: 1
				});
			},
			onPullDownRefresh() {
				//监听下拉刷新动作的执行方法，每次手动下拉刷新都会执行一次
				this.getuserlist();
				console.log('refresh');
				setTimeout(function() {
					uni.stopPullDownRefresh(); //停止下拉刷新动画
				}, 1000);
			},
			selectTap(id) {
				console.log("tap item id:" + JSON.stringify(id));
			}, //编辑
			editAddess(id) {
				var url = "../work/useredit?op=edit&id=" + id;
				if (!url) {
					uni.showToast({
						title: '模板未包含此页面',
						icon: "none"
					});
					return;
				}
				uni.navigateTo({
					url: url
				})
			},
			addAddess() {
				var url = "../work/useredit?op=add";
				if (!url) {
					uni.showToast({
						title: '模板未包含此页面',
						icon: "none"
					});
					return;
				}
				uni.navigateTo({
					url: url
				})
			},
			del(id,e) {
				var that = this;
				uni.showModal({
					title: '删除用户',
					content: '确定要删除该用户吗？',
					cancelText: '取消',
					confirmText: '确定',
					success: res => {
						if (res.confirm) {
							let sqls = "delete from c_user where id='" + id + "'";

							plus.sqlite.executeSql({
								name: 'test',
								sql: sqls,
								success: function(e) {
									uni.showToast({
										title: '删除成功！',
										icon: "success"
									});
									console.log('删除成功 操作!'); 
									that.getuserlist();
								},
								fail: function(e) {
									uni.showToast({
										title: '删除失败！',
										icon: "none"
									});
									console.log('executeSql failed: ' + JSON.stringify(e));
								}
							});
						}
					}
				})
			},
			getuserlist() {
				var _self = this;
				plus.sqlite.selectSql({
					name: 'test',
					sql: 'select * from c_user',
					success: function(data) {
						_self.userlist = data;
						console.log(_self.userlist.length);
					},
					fail: function(e) {
						console.log('selectSql failed: ' + JSON.stringify(e));
					}
				});

			}
		}
	}
</script>


<style>
	.container {
		background-color: #F2f2f2;
	}

	.address-list {
		width: 100%;
		background-color: #fff;
		margin-top: 20upx;
		padding-bottom: 100upx;
	}

	.address-list .a-address {
		width: 100%;
		margin-left: 30upx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30upx 0;
		border-bottom: 1upx solid #eee;
	}

	.a-address .left-text {
		width: 80%;
		box-sizing: border-box;
		padding-left: 58upx;
	}

	.a-address .left-text.active {
		background: url() no-repeat left center;
		background-size: 28upx auto;
	}

	.a-address .left-text .name-tel {
		margin-bottom: 20upx;
	}

	.a-address .left-text .address-box {
		font-size: 24upx;
		color: #888888;
		line-height: 36upx;
	}

	.a-address .right-edit {
		font-size: 48upx;
		color: #929292;
		//width: 15%;
		height: 100%;
		padding: 50upx 0 50upx 50upx;
		box-sizing: border-box;
		//background: url() no-repeat 43upx center;
		// background-size: 35upx auto;
	}

	.a-address .right-del {
		font-size: 48upx;
		color: #FF0000;
		width: 15%;
		height: 100%;
		padding: 50upx 0 50upx 50upx;
		margin-right: 50upx;
		// background: url() no-repeat 43upx center;
		// background-size: 35upx auto;
	}

	.bottom-box {
		position: fixed;
		width: 100%;
		bottom: 0;
		font-size: 28upx;
		color: #000000;
		border-top: 1upx solid #eee;
		height: 100upx;
		line-height: 100upx;
		//background: #fff url() no-repeat 705upx center;
		background-color: #FFFFFF;
		background-size: 15upx auto;
	}

	.bottom-box .add-btn {
		margin-left: 30upx;
		padding-left: 70upx;
		background: url() no-repeat left center;
		background-size: 40upx auto;
	}
</style>
